<template>
  <div>



   投资名称 <input type="text" v-model="state.data.Mname">
   总额区间 <input type="text" v-model="kmon">——
    <input type="text" v-model="jmon">
    <input type="button" value="查询" class="btn btn-success" @click="showhtml()">


<table class="table table-bordered">
  <tr>
    <td>投资名称</td>
    <td>投资总额度</td>
    <td>已投资额度</td>
    <td>剩余额度</td>
    <td>投资人数</td>
    <td>操作</td>
  </tr>
  <tr v-for="item in list">
    <td>{{  item.Mname}}</td>
    <td>{{ item.HAVE }}</td>
    <td>{{ item.Ymoney }}</td>
    <td>{{ item.Smoney }}</td>
    <td>{{ item.Numopp }}</td>
    <td>
      <input type="button" value="修改" class="btn btn-success" @click="Update(item.Mid)">
      <input type="button" value="删除" class="btn btn-success" @click="delet(item.Mid)">
    </td>
  </tr>
</table>


  </div>
</template>

<script setup lang="ts">


import{reactive,toRefs,onMounted}from'vue'

import axios from'axios'

import {useRouter}from'vue-router'
let router =useRouter()



let state=reactive({

data:{
  Mname:'',
    HAVE:'',
    Ymoney:'',
    Smoney:'',
    Numopp:''

},
list:[],
kmon:'',
jmon:''



})


//就绪函数
onMounted(()=>{

  showhtml()
})


 


let {data,list,kmon,jmon}=toRefs(state)
//显示页面
const showhtml:any=(()=>{


    axios({

      url:'https://localhost:44389/api/Default/showhtml',
      method:'get',
      params:{
        kname:state.data.Mname,
        mon:state.kmon,
        ymon:state.jmon
      }
      
    })
    .then(res=>{

      list.value=res.data.data
    })
    .catch(err=>{



    })





})
///跳转页面
const Update=((id:any)=>{



 
router.push({

  path:'/demo3',
  query:{

    id:id

  }

})


})
//删除
const delet=((id:any)=>{

if(confirm('确定删除吗？'))
{
  axios({

url:"https://localhost:44389/api/Default/showdelet/{id}",
method:'get',
params:{


  id:id
}


})
.then(res=>{

    if(res.data.data>0)
    {
      alert('删除成功')
      router.push('/demo2');
    }

})

.catch(err=>{



})


}




})
</script>

<style scoped>

</style>